<template>
  <div style="width: 500px">
    <vxe-grid v-bind="logsGridOptions"></vxe-grid>
  </div>
</template>
<script setup>
import {reactive} from 'vue'
const logsGridOptions = reactive({
  border: true,
  height: 310,
  align: 'left',
  columns: [
    { field: 'a', title: '日志类型', fixed: 'left' },
    { field: 'b', title: '设备名称', fixed: 'left' },
    { field: 'c', title: '描述' },
    { field: 'd', title: '位置' },
    { field: 'e', title: '时间' },
    { field: 'f', title: '时间' },
    { field: 'g', title: '时间' },
    { field: 'h', title: '时间' },
    { field: 'i', title: '时间' }
  ],
  data: [
    { id: 12, a: 1, b: '设备名称', c: '4.1W', d: '31°C', e: '详细的位置详细的位置详细的位置详细的位置详细的位置', f: '2A', g: '12.kw/h', h: '详细的位置' },
    { id: 13, a: 1, b: '设备名称', c: '4.1W', d: '31°C', e: '详细的位置详细的位置详细的位置详细的位置详细的位置', f: '2A', g: '12.kw/h', h: '详细的位置' },
    { id: 14, a: 1, b: '设备名称', c: '4.1W', d: '31°C', e: '详细的位置详细的位置详细的位置详细的位置详细的位置', f: '2A', g: '12.kw/h', h: '详细的位置' },
    { id: 15, a: 1, b: '设备名称', c: '4.1W', d: '31°C', e: '详细的位置详细的位置详细的位置详细的位置详细的位置', f: '2A', g: '12.kw/h', h: '详细的位置' },
    { id: 16, a: 1, b: '设备名称', c: '4.1W', d: '31°C', e: '详细的位置详细的位置详细的位置详细的位置详细的位置', f: '2A', g: '12.kw/h', h: '详细的位置' },
    { id: 178, a: 1, b: '设备名称', c: '4.1W', d: '31°C', e: '详细的位置详细的位置详细的位置详细的位置详细的位置', f: '2A', g: '12.kw/h', h: '详细的位置' },
    { id: 17, a: 1, b: '设备名称', c: '4.1W', d: '31°C', e: '详细的位置详细的位置详细的位置详细的位置详细的位置', f: '2A', g: '12.kw/h', h: '详细的位置' },
    { id: 187, a: 1, b: '设备名称', c: '4.1W', d: '31°C', e: '详细的位置详细的位置详细的位置详细的位置详细的位置', f: '2A', g: '12.kw/h', h: '详细的位置' }
  ]
})
</script>
